﻿<!doctype html>
<html class="no-js" lang="en-us">

<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Mayabi - Multipurpose Portfolio/Business HTML5 Template</title>
    <meta name="keywords" content="Corporate Business Shopse HTML5 Css3 Template" />
    <meta name="description" content="mayabi | Minimal Multipurpose HTML5 Template" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    

    <!-- css here -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/owl.carousel.min.css">
    <link rel="stylesheet" href="assets/css/owl.theme.default.min.css">
    <link rel="stylesheet" href="assets/css/slicknav.min.css">
    <link rel="stylesheet" href="assets/css/animate.min.css">
    <link rel="stylesheet" href="assets/css/magnific-popup.css">
    <link rel="stylesheet" href="assets/css/font-awesome.min.css">
    <link rel="stylesheet" href="assets/css/linebar.min.css">
    <link rel="stylesheet" href="assets/css/scrolltop.css">
    <link rel="stylesheet" href="assets/css/nice-select.css">
    <link rel="stylesheet" href="assets/css/jquery-ui.css">
    <link rel="stylesheet" href="assets/css/slick.css">
    <link rel="stylesheet" href="assets/css/slick-theme.css">
    <link rel="stylesheet" href="assets/css/default.css">
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="assets/css/responsive.css">
</head>

<body>
    <!--[if lte ie 9]>
            <p class="browserupgrade">you are using an <strong>outdated</strong> browser. please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
        <![endif]-->

    <!-- Preloader -->
    <div class="mayabi-loader">
        <div class="preloader">
            <div class="item item-1"></div>
            <div class="item item-2"></div>
            <div class="item item-3"></div>
            <div class="item item-4"></div>
        </div>
    </div>
    <!-- header area start -->
    <div class="header-area">
        <div class="container">
            <div class="row">
                <!-- logo start -->
                <div class="col-md-3">
                    <div class="header-logo">
                        <a href="index.html"><img src="assets/img/logo.png" alt="logo" class="img-fluid" /></a>
                    </div>
                </div>
                <div class="responsive-menu-wrap"></div>
                <!-- nav start -->
                <div class="col-md-9">
                    <div class="mainmenu">
                        <ul id="navigation">
                            <li><a href="index.html">home</a></li>
                            <li><a href="about-1.html">about us</a></li>
                            <li><a href="#">portfolio <i class="fa fa-angle-down"></i></a>
                                <ul>
                                    <li><a href="folio-full-width.html"><i class="fa fa-angle-right"></i> portfolio full width</a></li>
                                    <li><a href="folio-2-col.html"><i class="fa fa-angle-right"></i> portfolio 2 column</a></li>
                                    <li><a href="folio-3-col.html"><i class="fa fa-angle-right"></i> portfolio 3 column</a></li>
                                    <li><a href="folio-4-col.html"><i class="fa fa-angle-right"></i> portfolio 4 column</a></li>
                                    <li><a href="#"><i class="fa fa-angle-right"></i> portfolio masonry </a>
                                        <ul>
                                            <li><a href="folio-masonry-1.html"> portfolio masonry 1</a></li>
                                            <li><a href="folio-masonry-2.html"> portfolio masonry 2</a></li>
                                            <li><a href="folio-masonry-3.html"> portfolio masonry 3</a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                            <li class="current-item"><a href="#">blog <i class="fa fa-angle-down"></i></a>
                                <ul>
                                    <li>
                                        <a href="blog-2-col.html"><i class="fa fa-angle-right"></i> blog 2 column</a>
                                    </li>
                                    <li>
                                        <a href="blog-3-col.html"><i class="fa fa-angle-right"></i> blog 3 column</a>
                                    </li>
                                    <li>
                                        <a href="#"><i class="fa fa-angle-right"></i> blog left sidebar</a>
                                        <ul>
                                            <li><a href="blog-2-col-left.html">2 column left sidebar</a></li>
                                            <li><a href="blog-1-col-left.html">1 column left sidebar</a></li>
                                        </ul>
                                    </li>
                                    <li>
                                        <a href="#"><i class="fa fa-angle-right"></i> blog right sidebar</a>
                                        <ul>
                                            <li><a href="blog-2-col-right.html">2 column right sidebar</a></li>
                                            <li><a href="blog-1-col-right.html">1 column right sidebar</a></li>
                                        </ul>

                                    </li>
                                    <li>
                                        <a href="blog-no-sidebar.html"><i class="fa fa-angle-right"></i> blog no sidebar</a>
                                    </li>
                                    <li>
                                        <a href="blog-details.html"><i class="fa fa-angle-right"></i> blog details</a>
                                    </li>
                                    <li>
                                        <a href="#"><i class="fa fa-angle-right"></i>blog details sidebar</a>
                                        <ul>
                                            <li><a href="blog-details-left-sidebar.html">details left sidebar</a></li>
                                            <li><a href="blog-details-right-sidebar.html">details right sidebar</a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                            <li><a href="#">shop <i class="fa fa-angle-down"></i></a>
                                <ul>
                                    <li><a href="shop-3-col.html"><i class="fa fa-angle-right"></i> shop 3 column</a></li>
                                    <li><a href="shop-4-col.html"><i class="fa fa-angle-right"></i> shop 4 column</a></li>
                                    <li><a href="shop-2col-left-sidebar.html"><i class="fa fa-angle-right"></i>shop 2 col left sidebar</a></li>
                                    <li><a href="shop-2col-right-sidebar.html"><i class="fa fa-angle-right"></i>shop 2 col right sidebar</a></li>
                                    <li><a href="shop-3col-left-sidebar.html"><i class="fa fa-angle-right"></i>shop 3 col left sidebar</a></li>
                                    <li><a href="shop-3col-right-sidebar.html"><i class="fa fa-angle-right"></i>shop 3 col right sidebar</a></li>
                                    <li><a href="product-details.html"><i class="fa fa-angle-right"></i>product details</a></li>
                                    <li><a href="cart.html"><i class="fa fa-angle-right"></i>cart</a></li>
                                    <li><a href="login.html"><i class="fa fa-angle-right"></i>login</a></li>
                                </ul>
                            </li>
                            <li><a href="contact.html">contact us</a></li>
                        </ul>
                    </div>

                    <div class="header-search-bar">
                        <form action="index.html">
                            <input type="search" placeholder="keywords ...">
                        </form>
                    </div>
                </div>
                <!-- nav end -->
            </div>
        </div>
    </div>
    <!-- header area end -->
    <!-- breadcroumb area start -->
    <div class="mayabi-breadcroumb blue-bg text-center sec-p-100">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h2>1 column blog left sidebar</h2>
                    <h4><a href="index.html">home </a>/ 1 column blog left sidebar</h4>
                </div>
            </div>
        </div>
    </div>
    <!-- breadcroumb area end -->

    <!-- blog area start -->
    <div class="blog-area sec-p-100">
        <div class="container">
            <div class="row">
                <div class="col-md-4 col-sm-12">
                    <div class="row">
                        <div class="col-md-12">
                            <!-- search wedget -->
                            <div class="single-sid-wdg">
                                <h4 class="sid-wdg-title"><strong>search</strong> here
                                    <span></span></h4>
                                <form action="#" class="wdg-search-form">
                                    <input type="text" placeholder="type to search here...">
                                    <button class="submit-btn" type="submit"><i class="fa fa-search"></i></button>
                                </form>
                            </div>

                            <!-- latest post wedget -->
                            <div class="single-sid-wdg">
                                <h4 class="sid-wdg-title"><strong>latest</strong> post<span></span></h4>
                                <div class="sid-wdg-post">
                                    <div class="single-wdg-post">
                                        <div class="wdg-post-img">
                                            <a href="#">
                                                <img src="assets/img/wdg/wdg-img-1.jpg" alt="blog thumbnail" class="img-fluid">
                                            </a>
                                        </div>
                                        <div class="wdg-post-content">

                                            <h5><a href="#">Simply dummy text of in typesetting</a></h5>
                                            <span>may 03, 2019</span>
                                        </div>

                                    </div>

                                    <div class="single-wdg-post">
                                        <div class="wdg-post-img">
                                            <a href="#">
                                                <img src="assets/img/wdg/wdg-img-2.jpg" alt="blog thumbnail" class="img-fluid">
                                            </a>
                                        </div>
                                        <div class="wdg-post-content">

                                            <h5><a href="#">Simply dummy text of in typesetting</a></h5>
                                            <span>may 03, 2019</span>
                                        </div>

                                    </div>

                                    <div class="single-wdg-post">
                                        <div class="wdg-post-img">
                                            <a href="#">
                                                <img src="assets/img/wdg/wdg-img-3.jpg" alt="blog thumbnail" class="img-fluid">
                                            </a>
                                        </div>
                                        <div class="wdg-post-content">

                                            <h5><a href="#">Simply dummy text of in typesetting</a></h5>
                                            <span>may 03, 2019</span>
                                        </div>

                                    </div>
                                </div>
                            </div>

                            <!-- gallery wedget -->
                            <div class="single-sid-wdg">
                                <h4 class="sid-wdg-title"><strong>gallery</strong> widget<span></span></h4>
                                <div class="gallery-all-img">
                                    <a href="#"><img src="assets/img/wdg/wdg-img-4.jpg" alt="wdg-img" class="img-fluid" /></a>
                                    <a href="#"><img src="assets/img/wdg/wdg-img-5.jpg" alt="wdg-img" class="img-fluid" /></a>
                                    <a href="#"><img src="assets/img/wdg/wdg-img-6.jpg" alt="wdg-img" class="img-fluid" /></a>
                                    <a href="#"><img src="assets/img/wdg/wdg-img-7.jpg" alt="wdg-img" class="img-fluid" /></a>
                                    <a href="#"><img src="assets/img/wdg/wdg-img-8.jpg" alt="wdg-img" class="img-fluid" /></a>
                                    <a href="#"><img src="assets/img/wdg/wdg-img-9.jpg" alt="wdg-img" class="img-fluid" /></a>
                                </div>
                            </div>

                            <!-- slider wedget -->
                            <div class="single-sid-wdg">
                                <div class="wedget-slider-all text-center owl-carousel owl-theme">
                                    <div class="single-wdg-slider">
                                        <a href="#"><img src="assets/img/wdg/wdg-img-10.png" alt="img" class="img-fluid" /></a>
                                        <h3>mark jackson</h3>
                                        <p>Sed ut perspiciatis unde omnis iste natus sit voluptatem accusantium doloremque totam rem aperiam, eaque ipsa quae ab illo quasi Nemo enim ipsam voluptatem quia</p>
                                    </div>
                                    <div class="single-wdg-slider">
                                        <a href="#"><img src="assets/img/wdg/wdg-img-10.png" alt="img" class="img-fluid" /></a>
                                        <h3>mark jackson</h3>
                                        <p>Sed ut perspiciatis unde omnis iste natus sit voluptatem accusantium doloremque totam rem aperiam, eaque ipsa quae ab illo quasi Nemo enim ipsam voluptatem quia</p>
                                    </div>
                                </div>
                            </div>

                            <!-- archive post wedget -->
                            <div class="single-sid-wdg">
                                <h4 class="sid-wdg-title"><strong>post</strong> archive</h4>
                                <ul class="wdg-post-archive">
                                    <li><a href="#"><i class="fa fa-caret-right"></i>all<span>470</span></a></li>
                                    <li><a href="#"><i class="fa fa-caret-right"></i>jun 2016<span>(11)</span></a></li>
                                    <li><a href="#"><i class="fa fa-caret-right"></i>aug 2017<span>(02)</span></a></li>
                                    <li><a href="#"><i class="fa fa-caret-right"></i>sep 2018<span>(13)</span></a></li>
                                    <li><a href="#"><i class="fa fa-caret-right"></i>dec 2019<span>(444)</span></a></li>
                                </ul>
                            </div>

                            <!-- follow us wedget -->
                            <div class="single-sid-wdg">
                                <h4 class="sid-wdg-title"><strong>follow</strong> us</h4>
                                <ul class="wdg-follow-us">
                                    <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                    <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                    <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                    <li><a href="#"><i class="fa fa-pinterest-p"></i></a></li>
                                    <li><a href="#"><i class="fa fa-instagram"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-8">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="single-blog">
                                <div class="blog-img-ctg">
                                    <img src="assets/img/blog/blog-19.jpg" alt="blog" class="img-fluid">
                                </div>
                                <div class="single-blog-content">
                                    <h3><a href="#">We are best for our company.</a></h3>
                                    <ul class="admin-info">
                                        <li><a href="#"><i class="fa fa-user-circle-o"></i> by: admin</a></li>
                                        <li><a href="#"><i class="fa fa-calendar"></i> december 10, 2019</a></li>
                                    </ul>
                                    <p>lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut olore magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut ex ea commodo consequat. duis
                                        aute irure dolor in reprehenderit in</p>
                                    <a href="#" class="btn">more <i class="fa fa-angle-right"></i></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="spacer-25"></div>

                    <div class="row">
                        <div class="col-md-12">
                            <div class="single-blog">
                                <div class="blog-img-ctg">
                                    <img src="assets/img/blog/blog-20.jpg" alt="blog" class="img-fluid">
                                </div>
                                <div class="single-blog-content">
                                    <h3><a href="#">We are best for our company.</a></h3>
                                    <ul class="admin-info">
                                        <li><a href="#"><i class="fa fa-user-circle-o"></i> by: admin</a></li>
                                        <li><a href="#"><i class="fa fa-calendar"></i> december 10, 2019</a></li>
                                    </ul>
                                    <p>lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut olore magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut ex ea commodo consequat. duis
                                        aute irure dolor in reprehenderit in</p>
                                    <a href="#" class="btn">more <i class="fa fa-angle-right"></i></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="spacer-25"></div>

                    <div class="row">
                        <div class="col-md-12">
                            <div class="single-blog">
                                <div class="blog-img-ctg">
                                    <img src="assets/img/blog/blog-21.jpg" alt="blog" class="img-fluid">
                                </div>
                                <div class="single-blog-content">
                                    <h3><a href="#">We are best for our company.</a></h3>
                                    <ul class="admin-info">
                                        <li><a href="#"><i class="fa fa-user-circle-o"></i> by: admin</a></li>
                                        <li><a href="#"><i class="fa fa-calendar"></i> december 10, 2019</a></li>
                                    </ul>
                                    <p>lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut olore magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut ex ea commodo consequat. duis
                                        aute irure dolor in reprehenderit in</p>
                                    <a href="#" class="btn">more <i class="fa fa-angle-right"></i></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="spacer-25"></div>

                    <div class="row">
                        <div class="col-md-12">
                            <div class="single-blog">
                                <div class="blog-img-ctg">
                                    <img src="assets/img/blog/blog-22.jpg" alt="blog" class="img-fluid">
                                </div>
                                <div class="single-blog-content">
                                    <h3><a href="#">We are best for our company.</a></h3>
                                    <ul class="admin-info">
                                        <li><a href="#"><i class="fa fa-user-circle-o"></i> by: admin</a></li>
                                        <li><a href="#"><i class="fa fa-calendar"></i> december 10, 2019</a></li>
                                    </ul>
                                    <p>lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut olore magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut ex ea commodo consequat. duis
                                        aute irure dolor in reprehenderit in</p>
                                    <a href="#" class="btn">more <i class="fa fa-angle-right"></i></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="spacer-25"></div>
                    <div class="mayabi-pagination" aria-label="page navigation example">
                        <ul class="pagination justify-content-start">
                            <li class="page-item">
                                <a class="page-link" href="#">
                            <i class="fa fa-long-arrow-left"></i>
                        </a>
                            </li>
                            <li class="page-item active">
                                <a class="page-link" href="#">1</a>
                            </li>
                            <li class="page-item">
                                <a class="page-link" href="#">2</a>
                            </li>
                            <li class="page-item">
                                <a class="page-link" href="#">3</a>
                            </li>
                            <li class="page-item">
                                <a class="page-link" href="#">
                            <i class="fa fa-long-arrow-right"></i>
                        </a>
                            </li>
                        </ul>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <!-- blog area end -->
    <!-- subscribe form area start -->
    <div class="subscribe-form sec-p-100 text-center blue-bg">
        <div class="container">
            <div class="row">
                <div class="col-md-6 mx-auto">
                    <h2>subscribe newsletter</h2>
                    <p>Enter your email and we'll send you details about new courses and events.</p>
                    <div class="subscribe-input">
                        <input class="form-control" type="email" placeholder="Enter your email" name="email">
                        <button type="submit" class="btn btn-type-4">subscribe</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- subscribe form area end -->
    <!-- footer area start -->
    <footer>
        <div class="footer-area sec-p-50">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="copy-right text-center">
                            <div class="footer-logo mb-30">
                                <a href="#"><img src="assets/img/logo.png" alt="logo" class="img-fluid" /></a>
                            </div>
                            copyright 2019 <a href="http://www.17sucai.com/">mayabi</a> | all rights reserved | designed by workertm
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- footer area end -->
    <!-- scrolltop button -->
    <div class="material-scrolltop"></div>

    <!-- js here -->
    <script src="assets/js/vendor/modernizr-3.5.0.min.js"></script>
    <script src="assets/js/vendor/jquery-1.12.4.min.js"></script>
    <script src="assets/js/popper.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="assets/js/jquery-ui.js"></script>
    <script src="assets/js/slicknav.min.js"></script>
    <script src="assets/js/owl.carousel.min.js"></script>
    <script src="assets/js/isotope.pkgd.min.js"></script>
    <script src="assets/js/imagesloaded.pkgd.min.js"></script>
    <script src="assets/js/magnific-popup.min.js"></script>
    <script src="assets/js/linebar.js"></script>
    <script src="assets/js/waypoints.min.js"></script>
    <script src="assets/js/counterup.min.js"></script>
    <script src="assets/js/nice-select.min.js"></script>
    <script src="assets/js/scrolltop.js"></script>
    <script src="assets/js/ajax-form.js"></script>
    <script src="assets/js/wow.min.js"></script>
    <script src="assets/js/plugins.js"></script>
    <script src="assets/js/slick.min.js"></script>
    <script src="assets/js/main.js"></script>
</body>

</html>
